<template>
    <tabs-page :list="pageList" />
</template>

<script>
import {mapState} from "vuex";
import DataAuth from "./DataAuth.vue";
import UnOpen from "./UnOpen.vue";
import Setting from "./setting.vue";

export default {
    name: "SysDataAuth",
    components: {
        TabsPage: () => import("@common/views/common/TabsPage.vue"),
    },
    data() {
        return {
            list: [
                {
                    title: '数据范围授权',
                    value: 'row',
                    permission: 'system:auth:dataAuth',
                },
                {
                    title: '数据字段授权',
                    value: 'field',
                    permission: 'system:auth:fieldAuth',
                    props: {
                        type: 'field',
                    },
                },
                {
                    title: '权限设置',
                    value: 'setting',
                    permission: 'system:auth:authSetting',
                    component: Setting,
                },
            ],
        };
    },
    computed: {
        ...mapState(['global_setting']),
        pageList() {
            const list = this.list.map(item => $.extend({}, item));
            list.forEach(item => {
                if (typeof item.component === 'undefined') {
                    const enable = this.global_setting[`${item.value === 'row' ? 'enable_data_auth' : 'enable_data_auth_field'}`]
                    item.component = enable === 1 ? DataAuth : UnOpen;
                }
            });
            return list;
        },
    },
    mounted() {
        this.init();
    },
    methods: {
        async init() {
            if (!this.global_setting || this.$utils.isEmpty(this.global_setting.id)) {
                await this.storeDispatch('initGlobalSetting');
            }
        },
    },
}
</script>

<style lang="less" rel="stylesheet/less" scoped>
.sys_data_auth_container {
    width: 100%;
    height: 100%;
    overflow: hidden;
}
</style>
